<template>
	<view>
		<view class="no">订单号：862940083824125</view>
		<view class="prod-img"><image class="img" src=""></image><text>金项链</text></view>
		<view class="list">
			<view class="li">
				<text class="name">规格</text>
				<view class="size">尺寸：40cm</view>
			</view>
			<view class="li">
				<text class="name">订单价格</text>
				<view class="shop-price">￥1999</view>
			</view>
			<view class="li">
				<text class="name">需补差价</text>
				<view class="cj-price">￥28</view>
			</view>
		</view>
		<view class="footer">
			<view class="total">合计：<text class="red">￥2027</text></view>
			<button>付款</button>
		</view>
		<view class="m-full-loading" v-if="bIsShowLoading">
			<view class="m-loading">
				<image src="../../../static/images/loading.gif" mode="widthFix"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import hl from '@/common/common_zb.js';
	export default {
		data() {
			return {
				imageList: [],
			}
		},
		methods: {
			
		},
		onReady() {
			
		}
	};
</script>

<style>
	.no{
		line-height: 100upx;
		color: #323232;
		font-size: 32upx;
		padding: 0 35upx;
	}
	.prod-img{
		background: #f5f3f3;
		padding-top: 35upx;
	}
	.prod-img .img{
		width: 213upx;
		height: 213upx;
		margin: 0 auto;
		display: block;
	}
	.prod-img text{
		line-height: 92upx;
		color: #424242;
		font-size: 36upx;
		display: block;
		width: 100%;
		text-align: center;
	}
	.list .li{
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 94upx;
		padding: 0 32upx;
		border-bottom: 1px solid #e6e6e6;
	}
	.list .li .name{
		color: #343434;
		font-size: 32upx;
	}
	.list .li .size{
		color: #333333;
		font-size: 28upx;
	}
	.list .li .shop-price{
		color: #333333;
		font-size: 36upx;
	}
	.list .li .cj-price{
		color: #f47a7a;
		font-size: 36upx;
	}
	.footer{
		position: fixed;
		bottom: 0;
		width: 100%;
		left: 0;
		height: 87upx;
		background: #FFFFFF;
		border-top: 1px solid #e6e6e6;
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
	.footer .total{
		color: #333333;
		font-size: 30upx;
		display: flex;
		align-items: center;
	}
	.footer .red{
		color: #f47a7a;
		font-size: 36upx;
		font-weight: bold;
	}
	.footer button{
		width: 232upx;
		background: #f47a7a;
		color: #FFFFFF;
		text-align: center;
		height: 100%;
		line-height: 88upx;
		margin-left: 50upx;
	}
	.m-full-loading{
		background: rgba(255,255,255,0);
	}
</style>
